<template>
	<div class="app-container">
		<el-dialog :title="dialogTitle" :visible.sync="dialogShow" width="800px" append-to-body>
			<el-form ref="form" :model="form" :rules="rules" label-width="100px">
				<el-row :gutter="20">
					<el-col :span="12">
						<el-form-item label="名称" prop="a">
							<common-input v-model="form.a" placeholder="请输入" />
						</el-form-item>
					</el-col>

					<el-col :span="12">
						<el-form-item label="周期" prop="a">
							<el-select v-model="form.b" placeholder="请选择" clearable >
								<el-option label="全部" value></el-option>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="12">
						<el-form-item label="时间" prop="c">
							<el-date-picker
								v-model="form.c"
								type="datetime"
								placeholder="选择日期时间"
								value-format="yyyy-MM-dd HH:mm:ss"
								format="yyyy-MM-dd HH:mm:ss"
							></el-date-picker>
						</el-form-item>
					</el-col>

					<el-col :span="12">
						<el-form-item label="模块" prop="a">
							<el-select v-model="form.b" placeholder="请选择" clearable >
								<el-option label="全部" value></el-option>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="12">
						<el-form-item label="状态" prop="d">
							<el-radio v-model="form.h" label="1">启用</el-radio>
  							<el-radio v-model="form.h" label="2">停用</el-radio>
						</el-form-item>
					</el-col>

				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button type="primary" @click="submitForm">确 定</el-button>
				<el-button @click="close">取 消</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
export default {
	components: {},
	props: {},
	data() {
		return {
			dialogTitle: '新增', // 标题
			dialogShow: false, // 是否显示
			form: {},
			rules: {
				a: [
					{
						required: true,
						message: '请输入',
						trigger: 'blur',
					},
				],
				b: [
					{
						required: true,
						message: '请选择',
					},
				],
				c: [
					{
						required: true,
						message: '请输入',
						trigger: 'blur',
					},
				],
				d: [
					{
						required: true,
						message: '请输入',
						trigger: 'blur',
					},
				],
			},
			menuTree: [{
				id: 1,
				label: '保旺达软件技术有限公司',
				children: [{
					id: 2,
					label: '开发部',
					// children: [{
					//   id: 9,
					//   label: '三级 1-1-1'
					// }, {
					//   id: 10,
					//   label: '三级 1-1-2'
					// }]
				},{
					id: 3,
					label: '测试部'
				},{
					id: 4,
					label: '项目管理办'
				}]
				}], // 菜单树
			treeProp: { // 树参数
				children: 'children',
				label: 'label'
			},
		};
	},
	watch: {},
	computed: {},
	methods: {

		handleNodeClick(data) {
			console.log(JSON.stringify(data));
			console.log(data.label);
		},
		/**
		 * 关闭
		 */
		close() {
			this.$refs.form.resetFields();
			this.dialogShow = false;
			this.$emit('refresh');
		},
		/**
		 * 显示
		 */
		show(data) {
			this.dialogTitle = data.id ? '编辑' : '新增';
			this.dialogShow = true;
			this.form = data.id ? data : this.$options.data().form;
		},
		/**
		 * 提交
		 */
		submitForm() {
			this.$refs['form'].validate((valid) => {
				if (valid) {
					this.$GlobalSuccessMessage('操作成功');
				}
			});
		},
	},
	created() {},
	mounted() {},
};
</script>
<style lang="scss" scoped>

</style>
